import { createApp } from 'vue'
import App from './App.vue'
import router from './router'
import { createPinia } from 'pinia'
import myPlugin from './plugins/myPlugin'

import LoadingSvg from "./components/LoadingSvg.vue"
import BackSvg from './components/BackSvg.vue'
import role from './store/role'

import './assets/scss/default.scss'
import './assets/scss/group.scss'
import './assets/scss/pop_msg.scss'

const app = createApp(App)

app.component('LoadingSvg', LoadingSvg)
app.component('BackSvg', BackSvg)

app.use(router).use(createPinia()).use(myPlugin).mount('#app')

// 权限控制
app.directive('permission', {
    mounted(el, binding) {
        const rolePinia = role()
        const limits = rolePinia.limits
        const permission = binding.value;//获取指令值
        console.log(permission,limits);
        if (!limits[permission]) {
            el.parentElement.removeChild(el);//没有该内容权限
        }
    },
});
